<template>
    <div>
        <el-container>
            <el-header>
                <el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal" @select="handleSelect">
                    <el-row :gutter="24">
                        <el-col :span="4" :offset="2"><img src="@/assets/logo3.png" width="200px"></el-col>
                        <el-col :span="2" ><el-menu-item index="/">首页</el-menu-item></el-col>
                        <el-col :span="2" ><el-menu-item index="/schedule">课表</el-menu-item></el-col>
                        <el-col :span="12" :offset="1"><el-dropdown :hide-on-click="false">
                <span class="el-dropdown-link" style="font-size: 20px">
                    {{teacher?teacher.name:student?student.name:"用户"}}
                    <i class="el-icon-arrow-down el-icon--right"></i>
                </span>
                            <el-dropdown-menu slot="dropdown">
                                <el-menu-item index="/userCenter"><i class="el-icon-user-solid"></i>个人中心</el-menu-item>
                                <el-menu-item index="/noticeList"><i class="el-icon-message-solid"></i>
                                    <el-badge v-if="number>0" :value=number class="item"></el-badge>
                                    通知</el-menu-item>
                                <el-menu-item @click="quitLogin"><i class="el-icon-s-promotion"></i>退出</el-menu-item>
                            </el-dropdown-menu>
                        </el-dropdown></el-col>
                    </el-row>
                </el-menu>
            </el-header>
        </el-container>
        <el-main>
            <router-view></router-view>
        </el-main>
    </div>
</template>

<script>
    export default {
        name: "HomeView",
        data() {
            return {
                number:'',
                status:'',
                activeIndex: '1',
                activeIndex2: '1',
                teacher:JSON.parse(window.localStorage.getItem("teacher")),
                student:JSON.parse(window.localStorage.getItem("student")),
            };
        },
        created() {
            this.getData();
        },
        methods: {

            //获取未读信息数量
            getNumber(){
                let id;
                if(window.localStorage.getItem("student")!=null){
                    this.status=1;
                    id =  JSON.parse(window.localStorage.getItem("student")).id;
                }
                else{
                    this.status=2;
                    id =  JSON.parse(window.localStorage.getItem("teacher")).id;
                }
                this.$axios.post("/web/noticeRecord/noReader",'',{params:{id:id,status:this.status}}).then(response=>{
                    this.number=response.data.data;
                    console.log(this.number);
                });
            },

            quitLogin(){
                // 清空token
                window.localStorage.clear();
                //   跳转到登录页
                this.$router.push("/weblogin");
            },
            handleSelect(key, keyPath) {
                console.log(key, keyPath);
                console.log(this.$route.path)
                if(this.$route.path != key){
                    this.$router.push(key)
                }

            },
        }
    }
</script>

<style scoped>
    .el-dropdown-link {
        cursor: pointer;
        color: #409EFF;
        line-height: 60px;
    }

    .el-icon-arrow-down {
        font-size: 12px;
    }

</style>